import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
import FrameIn from '@/router/frameIn'
// 引入自创的主页面子路由组件
import Home from '@/views/Home.vue'
// 引入Home组件
import Layout from '@/components/Layout.vue'
// 引入Layout组件
import ListList from '@/views/ListList.vue'
import FrameOut from '@/router/frameOut'
import store from '@/store/index'
import { showMsg } from '@/utli/toast'
const routes: Array<RouteRecordRaw> = [
  // 自创的路由配置
  {
    name: 'home',
    // 声明名称
    path: '/',
    // 声明首页的根路径
    component: Layout,
    // 渲染的组件
    redirect: '/index',
    // 重定向
    children: FrameIn
    // 子路由封装成了一个独立的组件，直接实施调用(子路由的内容会出现在父路由组件当中的 rovter-view 标签中。)
  },
  ...FrameOut
  // 不在layout里面显示的页面都放在FrameOut当中
  // 登录注册等的独立页面
]

const router = createRouter({
  history: createWebHashHistory(),
  routes
})

interface MenuData {
  url: string
  name: string
  [keyname: string]: any
}
// 路由守卫
// 允许用户访问的具体页面，拦截无法访问的页面
router.beforeEach((after, before) => {
  const { path } = after // path就是要跳转的页面的链接
  if (path === '/index' || path === '/logo') return true
  const canEenter = store.state.menu.find((item: any) => item.url === path)
  if (canEenter) return true
  // if (path !== '/admin') return { name: 'index' }
  return true
})
export default router
